<template>
  <div>
    <note-templates :data="mathData" :list="directory">
      <template #note>
        <div id="note-item1">
          <title-card title="1.只保留整数部分（丢弃小数部分）"></title-card>
          <pre-code :code="mathparseInt" language="JavaScript" />
        </div>
        <div id="note-item2">
          <title-card title="2.向下取整（<= 该数值的最大整数）"></title-card>
          <pre-code :code="mathfloor" language="JavaScript" />
        </div>
        <div id="note-item3">
          <title-card title="3.向上取整（有小数，整数就+1）"></title-card>
          <pre-code :code="mathceil" language="JavaScript" />
        </div>
        <div id="note-item4">
          <title-card title="4.四舍五入（小数部分）"></title-card>
          <pre-code :code="mathround" language="JavaScript" />
        </div>
        <div id="note-item5">
          <title-card title="5.绝对值"></title-card>
          <pre-code :code="mathabs" language="JavaScript" />
        </div>
        <div id="note-item6">
          <title-card title="6.返回两者中的较大值"></title-card>
          <pre-code :code="mathmax" language="JavaScript" />
        </div>
        <div id="note-item7">
          <title-card title="7.返回两者中的较小值"></title-card>
          <pre-code :code="mathmin" language="JavaScript" />
        </div>
        <div id="note-item8">
          <title-card title="8.随机数（0-1）"></title-card>
          <p><b>Math.random()</b><span> 函数返回一个浮点数,  伪随机数在范围从<b>0</b>到小于<b>1</b>，也就是说，从0（包括0）往上，但是不包括1（排除1），然后您可以缩放到所需的范围。实现将初始种子选择到随机数生成算法;它不能被用户选择或重置。</span></p>
          <pre-code :code="mathrandom" language="JavaScript" />
        </div>
      </template>
    </note-templates>
  </div>
</template>

<script setup name="Math">
import NoteTemplates from '@/components/NoteTemplates/index.vue'
import TitleCard from "@/components/TitleCard/index.vue"
import { postArticleDetail } from '@/api/home.js';
import { onMounted, reactive, ref, toRefs } from 'vue';

const mathparseInt = ref(`parseInt(5.1234);// 5`)
const mathfloor = ref(`Math.floor(5.55) //向下取整 结果为5
Math.floor(5.99) //向下取整 结果为5`)
const mathceil = ref(`Math.ceil(5.21) //向上取整，结果为6
Math.ceil(5.88) //向上取整，结果为6`)
const mathround = ref(`Math.round(5.78) //四舍五入 结果为6
Math.round(5.33) //结果为5`)
const mathabs = ref(`Math.abs(-1);// 1`)
const mathmax = ref(`Math.max(1,2);// 2`)
const mathmin = ref(`Math.min(1,2);// 1`)
const mathrandom = ref(`function getRandomInt(max) {
  return Math.floor(Math.random() * max);
}

console.log(getRandomInt(3));
// expected output: 0, 1 or 2

console.log(getRandomInt(1));
// expected output: 0

console.log(Math.random());
// expected output: a number from 0 to <1`)

const directory = ref([
  { 
    name:'1.只保留整数部分（丢弃小数部分）',
    id: 'note-item1'
  },
  { 
    name:'2.向下取整（<= 该数值的最大整数）',
    id: 'note-item2'
  },
  { 
    name:'3.向上取整（有小数，整数就+1）',
    id: 'note-item3'
  },
  { 
    name:'4.四舍五入（小数部分）',
    id: 'note-item4'
  },
  { 
    name:'5.绝对值',
    id: 'note-item5'
  },
  { 
    name:'6.返回两者中的较大值',
    id: 'note-item6'
  },
  { 
    name:'7.返回两者中的较小值',
    id: 'note-item7'
  },
  { 
    name:'8.随机数（0-1）',
    id: 'note-item8'
  },
])
const data = reactive({
  mathData: {},
});
const { mathData } = toRefs(data);
const getTitle = () => {
  postArticleDetail({
    route: 'String',
  }).then((res) => {
    mathData.value = res.data;
  });
};
onMounted(()=>{
  getTitle();
})
</script>
